<!DOCTYPE html>
<html>
    <head>
        <!--
            ____       ____    __    __          ___         __
           /\  _`\    /\  _`\ /\ \  /\ \       /'___`\     /'__`\
           \ \ \/\ \  \ \ \L\_\ `\`\\/'/      /\_\ /\ \   /\ \/\ \
            \ \ \ \ \  \ \  _\/`\ `\ /'       \/_/// /__  \ \ \ \ \
             \ \ \_\ \__\ \ \/   `\ \ \          // /_\ \__\ \ \_\ \
              \ \____/\_\\ \_\     \ \_\        /\______/\_\\ \____/
               \/___/\/_/ \/_/      \/_/        \/_____/\/_/ \/___/
            ____ ____ ____ ____ ____ ____ ____ ____ ____ ____ ____ ____ ____
           ||w |||w |||w |||. |||d |||f |||y |||. |||c |||o |||. |||k |||r ||
           ||__|||__|||__|||__|||__|||__|||__|||__|||__|||__|||__|||__|||__||
           |/__\|/__\|/__\|/__\|/__\|/__\|/__\|/__\|/__\|/__\|/__\|/__\|/__\|
        -->
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Công ty thiết kế Web DT2A</title>
        <link type="text/css" rel="stylesheet" href="<?php echo bloginfo('template_directory'); ?>/css/font-awesome/font-awesome.css"/>
        <link type="text/css" rel="stylesheet" href="<?php echo bloginfo('template_directory'); ?>/style.css"/>
        <link type="text/css" rel="stylesheet" href="<?php echo bloginfo('template_directory'); ?>/css/menu.css"/>
        <link type="text/css" rel="stylesheet" href="<?php echo bloginfo('template_directory'); ?>/css/slider.css"/>
        <link type="text/css" rel="stylesheet" href="<?php echo bloginfo('template_directory'); ?>/css/jquery.bxslider.css"/>
        <script src="<?php echo bloginfo('template_directory'); ?>/js/app/app.loadmore.js"></script>
        <script src="<?php echo bloginfo('template_directory'); ?>/js/app/app.slider.js"></script>
        <script src="<?php echo bloginfo('template_directory'); ?>/js/jquery-1.8.1.min.js"></script>
        <script src="<?php echo bloginfo('template_directory'); ?>/js/jquery.bxslider.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                $('.bxslider').bxSlider();

                //***********Xu ly phan slider******************//
                sliderload.load();

                //************Xu ly phan scroll top***********//
                jQuery(document).ready(function() {
                    jQuery('#wrapper').append('<div id="top"><i class="fa-angle-up fa-2x"></i></div>');
                    jQuery(window).scroll(function() {
                        if (jQuery(window).scrollTop() != 0) {
                            jQuery('#top').fadeIn();
                        } else {
                            jQuery('#top').fadeOut();
                        }
                    });
                    jQuery('#top').click(function() {
                        jQuery('html, body').animate({scrollTop: 0}, 500);
                    });
                });

                //************Xu ly phan menu***********//
                $("#menufication-btn").mouseover(function() {
                    $(".menu-gioi-thieu-container").fadeIn();
                });
                $(".menu-gioi-thieu-container").mouseout(function() {
                    $(".menu-gioi-thieu-container").fadeOut();
                });
                $(".menu-gioi-thieu-container").mouseover(function() {
                    $(".menu-gioi-thieu-container").show();
                });
                //************Xu ly phan loadmore***********//
                loadMore.load();
                $("ul.list_website li.loadmore").bind({
                    click: function() {
                        loadMore.loadMore();
                    },
                    mouseover: function() {
                        $(this).find("img").css('opacity', '0.7');
                    },
                    mouseoout: function() {
                        $(this).find("img").css('opacity', '1');
                    }
                });

                //************Xu ly phan click xuong***********//
                jQuery('#slider').append('<div id="scrollmore">&nbsp;</div>');
                jQuery(window).scroll(function() {
                    if (jQuery(window).scrollTop() != 0) {
                        jQuery('#top').fadeIn();
                    } else {
                        jQuery('#top').fadeOut();
                    }
                });
                jQuery('#scrollmore').hover(function() {
                    $(this).css('cursor', 'pointer');
                });
                jQuery('#scrollmore').click(function() {
                    $(this).css('cursor', 'pointer');
                    jQuery('html, body').animate({scrollTop: "-50px"}, 500);
                });
            });

        </script>

        <style>
            #scrollmore{
                cursor: pointer;
                height: 50px;
                width: 100px;
                left: 635px;
                position: absolute;
                top: 555px;
                color: #FFF;
            }
        </style>
    </head>
    <body>
        <div id="wrapper">
            <div id="header">
                <div id="slider">
                    <img src="<?php echo bloginfo('template_directory'); ?>/images/banner.jpg" alt="" title=""/>
                </div>
                <div class="nav-menu">
                    <div id="menufication-btn"></div>
                    <?php wp_nav_menu(array('menu' => 'Page Menu')); ?>
                    <div class="clear"></div>
                </div>
                <div class="nav-right">
                    <ul>
                        <li><a href="#" class="home"><span>Home</span></a></li>
                        <li><a href="#" class="about"><span>About</span></a></li>
                        <li><a href="#" class="services"><span>services</span></a></li>
                        <li><a href="#" class="portfolio"><span>portfolio</span></a></li>
                        <li><a href="#" class="contact"><span>contact us</span></a></li>
                    </ul>
                </div>
                <div class="nav-left">

                </div>           
            </div><!--end#header -->
            <div class="clear"></div>